{php echo register_jssdk();}
{template 'common/header'}
<title>领取体验券</title>
<style type="text/css">
body {margin:0; font-family:'微软雅黑'; background:#f4f4f4;}
.top {overflow:hidden}
.top img { width:100%;height:200px;}
a{ text-decoration: none;}
.main {height:520px; padding:30px 12px;}
.main .text {height:20px; font-size:14px; line-height:20px; color:#666;}
.main .text span {color:#f6914b;}

.main .text1 {padding:5px; font-size:14px; line-height:20px; color:#666;}
.main .text1 span {color:#f6914b;}


.main .input {height:36px; margin:14px 10px 0 0;background:#fff;border-radius:5px;}
.main .input input {width:100%;  height:36px; border:0px; outline:none; font-size:15px; color:#999;}

.main .sub {height:40px; background:#e53c39; margin-top:14px; border-radius:5px; text-align:center; line-height:40px; color:#fff; font-size:16px;}
.main .title {height:30px; margin-top:20px; font-size:12px; line-height:30px; color:#666;}
.vip_main {height:182px; background:#fff; border-radius:4px;}  
.vip_main .vip {height:36px; padding:12px; border-bottom:1px solid #f1f1f1; overflow:hidden; font-size:12px; color:#999;}
.vip_main .vip .ico1 {height:36px; width:36px; background:#32cd32; border-radius:18px; color:#fff; font-size:20px; line-height:36px; text-align:center; float:left;}
.vip_main .vip .ico2 {height:36px; width:36px; background:#fece00; border-radius:18px; color:#fff; font-size:22px; line-height:40px; text-align:center; float:left;}
.vip_main .vip .text {height:36px; margin-left:12px; float:left;}
.vip_main .vip .text .t1 {height:18px; font-size:15px; color:#666; line-height:18px;}
.vip_main .vip .text .t2 {height:18px; font-size:13px; color:#999; line-height:18px;}


.ok {height:250px; padding-top:50px;}
.ok .ico {height:65px; width:65px; margin:auto; border:3px solid #32cd32; border-radius:55px; color:#32cd32; font-size:50px; text-align:center; line-height:65px;}
.ok .text {height:20px; margin-top:30px; font-size:16px; color:#666; line-height:20px; text-align:center;}
.ok .sub {height:32px; width:145px; background:#e53c39; margin:20px auto; border-radius:20px; color:#fff; line-height:32px; text-align:center; font-size:16px;}
#myModal{top:10%;}
.info2 {height:180px; background:#fff; padding:10px; padding-bottom:80px;}
.info2 .con {height:auto; padding:10px 0px;margin-left: 50px;}
.info2 .con .line2 {height:auto; overflow:hidden; margin-bottom:5px;}
.info2 .con .line2 .t1 {height:auto; width:55px; float:left; font-size:14px; color:#666; line-height:20px;}
.info2 .con .line2 .t2 {padding-left:0px;}
.info2 .con .line2 .t2 .t3 {height:auto; font-size:14px; color:#999;}

.info3 {height:150px; background:#fff; padding:10px; padding-bottom:80px; border-bottom:1px solid #eee; border-top:1px solid #eee;}
.info3 .con {height:auto; padding:10px 0px;margin-left: 50px;}
.info3 .con .line3 {height:auto; overflow:hidden; margin-bottom:5px;}
.info3 .con .line3 .t1 {height:auto; width:55px; float:left; font-size:14px; color:#666; line-height:20px;}
.info3 .con .line3 .t2 {padding-left:0px; background:#f90;}
.info3 .con .line3 .t2 .t3 {height:auto; float:left; font-size:14px; color:#999;}
#cover{display:none;position:absolute;left:0;top:0;z-index:18888;background-color:#000000;opacity:0.7;}
#guide{display:none;position:absolute;right:18px;top:5px;z-index:19999;}
#guide img{width:260px;height:180px;}
</style>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script>
        wx.ready(function () {
        shareData = {
            'title' : "{$experience['shopname']}",
            'desc': "{$experience['title']}",
            'link': "{php echo $this->createMobileUrl('experience/list')}&experienceid={$experience['id']}",
            'imgUrl': "http://wx.lanxuevip.com/attachment/{$experience['tupian']}",
        };
        //分享朋友
    wx.onMenuShareAppMessage({
        title: shareData.title,
        desc: shareData.desc,
        link: shareData.link,
        imgUrl:shareData.imgUrl,
        trigger: function (res) {
        },
        success: function (res) {
        	window.location.href =adurl;
        },
        cancel: function (res) {
            alert('分享是一种美德哦！');
        },
        fail: function (res) {
            alert(JSON.stringify(res));
        }
    });
//朋友圈
    wx.onMenuShareTimeline({
        title: shareData.title,
        link: shareData.link,
        imgUrl:shareData.imgUrl,
        trigger: function (res) {
        },
        success: function (res) {
            window.location.href =adurl;
        },
        cancel: function (res) {
            alert('分享是一种美德哦！');
        },
        fail: function (res) {
            alert(JSON.stringify(res));
        }
        });
    });
    </script>
<div id='container'></div>
<div class="top">
	<img src="http://wx.lanxuevip.com/attachment/{$experience['tupian']}" />
</div>
<div class="ok">
	{if $experience_ok == 1 || $experience_ok == 2}
        <div class="ico"><i class="fa fa-check"></i></div>
	<div class="text">成功领取体验券！</div>
	{elseif $experience_ok ==3}
	<div class="ico"><i class="fa fa-check"></i></div>
	<div class="text">请先支付{$experience['cash']}元之后才能领取体验券！</div>
        {elseif $experience_ok ==0}
	<div class="ico"><i class="fa fa-remove"></i></div>
	<div class="text">领取体验券失败！</div>
        {elseif $experience_ok==4}
	<div class="ico"><i class="fa fa-check"></i></div>
	<div class="text">您已领取过该体验券！</div>
        {elseif $experience_ok==5}
	<div class="ico"><i class="fa fa-remove"></i></div>
	<div class="text">已全部领取！</div>
        {elseif $experience_ok==6}
	<div class="ico"><i class="fa fa-remove"></i></div>
	<div class="text">已过有效期！</div>
        {/if}
        {if $experience_ok==2}
        <div  onclick="_system._guide(true)"><div class="sub">点击分享</div></div>
        {elseif $experience_ok==3}
        <a href="{php echo $this->createMobileUrl('order/pay')}&experience_record_log_id={$experience_record_log_id}"><div class="sub">去支付</div></a>
        {else}
        <a href="{php echo url('activity/experience/mine');}"><div class="sub">查看体验券</div></a>
        {/if}
</div>
<div class="info2">
<div class="con">
  <div class="line2">
        <div class="t2">
        <div class="t3">体&nbsp;&nbsp;验&nbsp;&nbsp;店：{$experience['shopname']}</div>
        </div>
  </div>
  <div class="line2">
        <div class="t2">
        <div class="t3">体验项目：{$experience['title']}</div>
        </div>
  </div>
  <div class="line2">
        <div class="t2">
        <div class="t3">价&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;值：{$experience['money']}元</div>
        </div>
  </div>
  <div class="line2">
        <div class="t2">
        <div class="t3">地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址：{$experience['address']}</div>
        </div>
  </div>
  <div class="line2">
        <div class="t2">
        <div class="t3">开始时间：{$experience['starttime']}</div>
        </div>
  </div>
  <div class="line2">
        <div class="t2">
        <div class="t3">结束时间：{$experience['endtime']}</div>
        </div>
  </div>
    </div>
</div>
<div class="info3">
<div class="con">
  <div class="line3">
        <div class="t2">
        <div class="t3">1.本券仅供体验店线下使用。</div>
        </div>
  </div>
  <div class="line3">
        <div class="t2">
        <div class="t3">2.本券不可兑换现金，不找零。</div>
        </div>
  </div>
  <div class="line3">
        <div class="t2">
        <div class="t3">3.本券在有效期内使用有效。</div>
        </div>
  </div>
  <div class="line3">
        <div class="t2">
        <div class="t3">4.体验券拥有最终解释权。</div>
        </div>
  </div>
    </div>
</div>
<div id="cover"></div>
<div id="guide">
    <img src="../addons/ewei_shop/static/images/gift/guide1.png">
</div>
{if $gzxx !== 1}
<div class="modal fade in" id="myModal" tabindex="1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" aria-hidden="false" style="text-align:center;display:block;">
    <img src="/app/resource/images/guanzhu.jpg" style="width:80%;border-radius:10px;position:relative;"/>
</div>
<div class="modal-backdrop fade in"></div>
{/if}
<script type="text/javascript">
    var _system={
        $:function(id){return document.getElementById(id);},
   _client:function(){
      return {w:document.documentElement.scrollWidth,h:document.documentElement.scrollHeight,bw:document.documentElement.clientWidth,bh:document.documentElement.clientHeight};
   },
   _scroll:function(){
      return {x:document.documentElement.scrollLeft?document.documentElement.scrollLeft:document.body.scrollLeft,y:document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop};
   },
   _cover:function(show){
      if(show){
     this.$("cover").style.display="block";
     this.$("cover").style.width=(this._client().bw>this._client().w?this._client().bw:this._client().w)+"px";
     this.$("cover").style.height=(this._client().bh>this._client().h?this._client().bh:this._client().h)+"px";
  }else{
     this.$("cover").style.display="none";
  }
   },
   _guide:function(click){
      this._cover(true);
      this.$("guide").style.display="block";
      this.$("guide").style.top=(_system._scroll().y+5)+"px";
      window.onresize=function(){_system._cover(true);_system.$("guide").style.top=(_system._scroll().y+5)+"px";};
  if(click){_system.$("cover").onclick=function(){
         _system._cover();
         _system.$("guide").style.display="none";
 _system.$("cover").onclick=null;
 window.onresize=null;
  };}
   },
   _zero:function(n){
      return n<0?0:n;
   }
}
</script>
{template 'common/footer'}